<template>
<!--  <el-input-number style="width: 100%" v-if="auth === 'edit'" :min="min" :max="max" v-model="model"-->
<!--                   :class="wrapperClass"-->
<!--                   :placeholder="placeholder" @blur="fieldValueChange"/>-->
  <el-checkbox v-if="auth === 'edit'" :checked="model === 1" v-model="model"
                   :class="wrapperClass" :true-label="1" :false-label="0"
                   @change="fieldValueChange"/>

<!--  <el-input-number style="width: 100%" v-else-if="auth === 'browse'" v-model="model" disabled-->
<!--                   @blur="fieldValueChange"/>-->

  <span v-else-if="auth === 'browse'">
    {{ model === 1 ? '是' : '否' }}
  </span>

<!--  <el-input-number style="width: 100%" v-else-if="auth === 'hide'" v-model="model" disabled-->
<!--                   type="password" @blur="fieldValueChange"/>-->

  <el-text truncated v-else-if="auth === 'static'">
    {{ model === 1 ? '是' : '否' }}
  </el-text>
</template>
<script setup>
import {computed, defineProps, ref, shallowRef, unref} from 'vue';
import {DefaultFieldDefinition} from '@/components/form/DefaultFormDefinition';
import {isEmpty} from '@/utils/CommonUtils';
import './textInput.css';

const props = defineProps({
  auth: {
    type: String,
    default: 'static'
  },
  notNull: {
    type: String,
    default: '0' //0表示非必填, 1表示必填
  },
  field: {
    type: Object,
    default() {
      return DefaultFieldDefinition;
    }
  }
});
const model = shallowRef(0);
const emits = defineEmits(['fieldValueChange']);

function getFieldValue(rowData) {
  return unref(model);
}

function resetField() {
  model.value = undefined;
}

function setFieldValue(value, obj) {
  if (isEmpty(value) || value + '' === '0') {
    model.value = 0;
  } else {
    model.value = 1;
  }
}

function fieldValueChange() {
  // if (model.value === 0 || isEmpty(model.value)) {
  //   model.value = 1
  // } else {
  //   model.value = 0
  // }
  emits('fieldValueChange', props.field);
}

function getFieldValueText() {
  return model.value === 1 ? '是' : '否';
}

function getFieldValueWithCheck(rowData) {
  return model.value;
}

const wrapperClass = computed(() => {
  return {
    notNull: props.notNull === '1' && isEmpty(model.value)
  };
});

defineExpose({
  getFieldValue,
  setFieldValue,
  resetField,
  getFieldValueText,
  getFieldValueWithCheck,
});
</script>
